<#assign pageTitle = "${channel.channelName!}" />
<#assign pageKeywords = pageTitle />
<#assign pageDescription = pageTitle />
<#assign channelId = 9 />
<#assign pageHeader>
</#assign>
<#assign pageContent>
    <div class="body-wrap">
        <div class="type-box white-bg">
            <div class="content-wrap">
                <div class="clearfix">
                    <span>专业：</span>
                    <ul class="fl">
                        <a title="全部" href="/book/index.html">
                            <li <#if query.categoryId==0>class="active"</#if>>全部</li>
                        </a>
                        <#list categoryRoots as category>
                            <a  title="${category.categoryName}" href="/book/index.html?categoryId=${category.categoryId}">
                                <li <#if (query.categoryId==category.categoryId || categoryParentId==category.categoryId)>class="active"</#if>>${category.categoryName}</li>
                            </a>
                        </#list>
                    </ul>
                </div>
                <#if categoryChildren?? && categoryChildren?size gt 0>
                    <div class="clearfix">
                        <span>子类：</span>
                        <ul class="fl">
                            <#list categoryChildren as category>
                                <a title="${category.categoryName}" href="/book/index.html?categoryId=${category.categoryId}">
                                    <li <#if query.categoryId==category.categoryId>class="active"</#if>>${category.categoryName}</li>
                                </a>
                            </#list>
                        </ul>
                    </div>
                </#if>
            </div>
        </div>
        <div class="filter-box white-bg">
            <div class="content-wrap">
                <div class="fl">
                    <span class="item <#if query.orderBy == 0>active</#if>" onclick="setOrderBy(0)">综合</span>
                    <span class="division">|</span>
                    <span class="item <#if query.orderBy == 1>active</#if>"  onclick="setOrderBy(1)">热门</span>
                    <span class="division">|</span>
                    <span class="item <#if query.orderBy == 2>active</#if>"  onclick="setOrderBy(2)">销量</span>
                </div>
                <div class="fr">
                    <div class="layui-form">
                        <label for="isElite">
                            <input onclick="setIsElite()" type="checkbox" id="isElite" value="1" title="推荐" lay-skin="primary" <#if query.isElite == 1 >checked</#if>>
                        </label>
                        <label for="isHot">
                            <input onclick="setIsHot()" type="checkbox" id="isHot" value="1" title="热门" lay-skin="primary" <#if query.isHot == 1 >checked</#if>>
                        </label>
                    </div>
                </div>
            </div>
        </div>
        <div class="white-bg overhiden mb-20" style="border-top: 1px solid #eaeaea">
            <div class="content-wrap">
                <div class="book-list-left">
                     <#if bookList?? && bookList?size gt 0>
                    <ul class="book-list-big">
                         <#list bookList as item>
                        <li>
                            <a class="pic"  href="/book/view/${item.id}.html" target="_blank">
                                <img src="${item.cover!}" alt="${item.title!}">
                            </a>
                            <p class="name">
                               <strong> <a title="${item.title!} " href="/book/view/${item.id}.html" target="_blank">${item.title!}</a></strong>
                            </p>
                            <p class="detail text-two">
                                ${item.intro!}
                            </p>
                            <p class="price">
                                <span class="search-now-price">￥${item.price/100.0}</span>
                                <#--<a class="search-discount" >原价：</a>
                                <span class="search-pre-price">¥${item.sourcePrice/100.0}</span>
                                <#if item.price gt 0 && item.sourcePrice gt item.price>
                                    <span class="search-discount layui-font-red">&nbsp;(${item.price*10.0/item.sourcePrice}折)</span>
                                </#if>-->
                            </p>
                            <p class="search-book-author">
                                <span><a href="#" name="itemlist-author" >${item.categoryName!}</a></span>
                                <span> / ${item.context!}</span>
                                <span> / ${item.publisher!}</span>
                                <span> / ${item.isbn!}</span>
                            </p>
                            <div class="shop-button">
                              <#--  <div class="layui-btn layui-btn-danger" onclick="bookBuy(${item.id})">立即购买</div>-->
                                <div class="layui-btn layui-btn-danger" onclick="bookRequire(${item.id})">样书申请</div>
                                <div class="layui-btn layui-btn-primary layui-border-red" onclick="favorites(${item.id},3,this)" >收藏</div>
                            </div>
                        </li>
                         </#list>
                    </ul>
                    <#else>
                        <div class="data-null">
                            <i class="icon-data-null"></i>
                            <p>小编还没有整理内容哦，去看看其它吧</p>
                        </div>
                     </#if>
                    <!--分页 s-->
                    <#if bookList?? && bookList?size gt 0>
                        <div id="list-ft" class="page-box mt-20 pd-20">
                        </div>
                    </#if>
                    <!--分页 e-->
                </div>
                <div class="book-list-right">
                    <div class="title">好书推荐</div>
                    <div class="book-list-small mb-20">
                        <#if bookEliteList?? && bookEliteList?size gt 0>
                            <#list bookEliteList as item>
                                 <div class="list-items">
                                 <div class="list-item">
                                    <div class="list-content">
                                        <a href="/book/view/${item.id}.html" target="_blank" class="list-book-img">
                                            <img src="${item.cover!}" alt="">
                                        </a>
                                        <div class="list-book-content">
                                            <a href="/book/view/${item.id}.html" target="_blank" class="list-book-title">${item.title!}</a>
                                            <div class="list-book-info">${item.intro!}</div>
                                            <div class="list-book-price">
                                                ￥${item.price/100}
                                            </div>
                                            <div class="list-book-type">${item.categoryName!}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            </#list>
                        </#if>
                    </div>
                </div>
            </div>
        </div>
    </div>
</#assign>
<#assign pageFooter>
    <script type="text/javascript" src="/static/js/order.js"></script>
<#--    <script type="text/javascript" src="/static/js/book/book-index.js?v=1"></script>-->
    <script type="text/javascript" src="/static/js/book/book-require.js?v=1"></script>
    <script type="text/javascript">
        var userId = ${userId}
        var categoryId = ${query.categoryId};
        var orderBy = ${query.orderBy};
        var isElite = ${query.isElite};
        var isHot = ${query.isHot};
        $(function () {
            layui.laypage.render({
                elem: 'list-ft'
                , theme: '#1E9FFF'
                , limit:${page.pageSize}
                , curr: ${page.currentPage}
                , count: ${page.totalRecords} //数据总数，从服务端得到
                , jump: function (obj, first) {
                    //首次不执行
                    if (!first) {
                        jumpList(obj.curr);
                    }
                }
            });
        });
        //排序
        function setOrderBy(value) {
            orderBy = value;
            jumpList(0);
        }
        //推荐
        function setIsElite() {
            if (isElite === 1) {
                isElite = 0;
            } else {
                isElite = 1;
            }
            jumpList(0);
        }
        //热门
        function setIsHot() {
            if (isHot === 1) {
                isHot = 0;
            } else {
                isHot = 1;
            }
            jumpList(0);
        }
        function jumpList(page) {
            var url = "list.html?categoryId=" + categoryId;
            if (orderBy > 0) {
                url += "&orderBy=" + orderBy;
            }
            if (isElite === 1) {
                url += "&isElite=1";
            }
            if (isHot === 1) {
                url += "&isHot=1";
            }
            if (page > 0){
                url += "&page=" + page;
            }
            location.href = url;
        }
    </script>
</#assign>
<#include "../layouts/layout.ftl">
